﻿<main class="container" id="mainContent">
  <div class="row justify-content-center py-5">
    <h3>AngularList</h3>
  </div>
  <div class="row">
    <div class="col-12 p-0">
      <app-form (inputText)="addItem($event)"></app-form>
    </div>
    <app-list-item
      class="col-12 mb-3 border"
      *ngFor="let listItem of (listItems$ | async)"
      [listItem]="listItem"
      [id]="listItem.id"
      (deleteItem)="deleteItem($event)"
    >
    </app-list-item>

    <app-warning-message
      *ngIf="warningMessageOpen"
      [text]="warningMessageText"
      (warningMessageOpen)="handleWarningClose($event)"
    ></app-warning-message>
  </div>
</main>
